<template>
  <div class="assetDetailsDesc hideScrollBar">
    <!-- 内容部分 -->
    <div class="content">
      <!-- 导航 -->
      <NavBar :title="t('mvp.szmxDesc.pageTitle')" isTransparent isFixed />
      <!-- 内容 -->
      <div style="padding-top: 20px">
        <div class="content-bg">
          <div v-for="(item, index) in list" :key="index" class="content-box">
            <div class="content-box-img">
              <Images src="/image/assetDetails/desc-logo.svg"></Images>
            </div>
            <div class="text-zw" @click="copyToken">{{ item }}</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script setup name="assetDetailsDesc">
import { navigateI18nTo, isiOS, isAndroid } from "@/utils";
import { useGlobalStore } from "~~/store/global";
import { useUserStore } from "~~/store/modules/user";
import * as MITO from "@zhj1214/qdjk-web";

// definePageMeta({
//   keepalive: true,
// });
const { t } = useI18n();
const list = [
  t("mvp.szmxDesc.text1"),
  t("mvp.szmxDesc.text2"),
  t("mvp.szmxDesc.text3"),
  t("mvp.szmxDesc.text4"),
  t("mvp.szmxDesc.text5"),
  t("mvp.szmxDesc.text6"),
];
const userState = useUserStore();
const globalStore = useGlobalStore();

const isPermissions = computed(() => {
  if (userState.$state.email) {
    return userState.$state.email.includes("zhj1214");
  }
  return false;
});

let cs = 0;
const copyToken = () => {
  cs += 1;
  if (cs > 8) {
    cs = 0;

    MITO.log({
      message: globalStore.$state.token || "token上报",
      tag: "手动上报",
      level: "low",
      ex: "手动上报",
    });
    if (isPermissions.value) {
      navigateI18nTo({
        path: "/",
        query: {
          who: "zhj",
        },
      });
    }
  }
};
</script>
<style lang="scss" scoped>
.assetDetailsDesc {
  position: relative;
  background-color: #f4f5f7;
  height: 100vh;
  overflow-y: scroll;
  overflow-x: hidden;

  margin-bottom: constant(safe-area-inset-bottom);
  margin-bottom: env(safe-area-inset-bottom);
  padding-bottom: 33 * 2px;

  .content {
    background: linear-gradient(
      180deg,
      #96c9ff 0.07%,
      rgba(226, 236, 255, 0) 99.93%
    );
    background-size: 100vh 250 * 2px;
    background-repeat: no-repeat;
    &-bg {
      margin: 0 15 * 2px;
      border-radius: 12 * 2px;
      background-color: #fff;
      padding-bottom: 30px;
    }
    &-box {
      display: flex;
      align-items: flex-start;

      padding: 15 * 2px;
      padding-bottom: 0 * 2px;
      &-img {
        width: 10 * 2px;
        height: 10 * 2px;
        margin-right: 8 * 2px;
        margin-top: 5 * 2px;
      }
    }
  }

  .text {
    &-zw {
      flex: 1;
      color: #141924;
      font-size: 13 * 2px;
      line-height: 18 * 2px;
      word-break: break-word;
    }
    &-oneline {
      margin-bottom: 18 * 2px;
    }
  }

  .mb10 {
    margin-bottom: 10 * 2px !important;
  }
}
</style>
